<template>
    <div>
        <!-- 地址详情  还没有写三级联动 尚需要各种完善-->
         <el-dialog
      title="地址详情"
      :visible.sync="dialogVisible"
      width="60%"
      :before-close="handleClose"
    >
        <el-row>
            <el-form :model="AddressList" :rules="rules"  label-width="140px" class="demo-ruleForm">
                <el-col :span="24">
                    <el-form-item label="发货地址" prop="addressName">
                         <el-input v-model="AddressList.addressName" placeholder="发货地址"></el-input>
                    </el-form-item>
                </el-col>
                 <el-col :span="24">
                    <el-form-item label="发货人姓名" prop="name">
                         <el-input v-model="AddressList.name" placeholder="发货人姓名"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="24">
                    <el-form-item label="发货人手机号" prop="phone">
                         <el-input v-model="AddressList.phone" placeholder="发货人手机号"></el-input>
                    </el-form-item>
                </el-col>
                 <el-col :span="24">
                    <el-form-item label="邮政编码" prop="phone">
                         <el-input v-model="AddressList.postCode" placeholder="邮政编码"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="24">
                    <el-form-item label="收货地址">
                         <!-- <el-input v-model="AddressList.postCode" placeholder="邮政编码"></el-input> -->
                    </el-form-item>
                </el-col>
                 <el-col :span="24">
                    <el-form-item label="详细地址" prop="detailAddress">
                         <el-input v-model="AddressList.detailAddress" placeholder="详细地址"></el-input>
                    </el-form-item>
                </el-col>
                 <el-col :span="12">
                    <el-form-item label="是否默认收货地址" >
                        <el-switch  v-model="AddressList.receiveStatus" :active-value="1" :inactive-value="0"></el-switch>
                    </el-form-item>
                </el-col>
                <el-col :span="12">
                    <el-form-item label="是否默认发货地址" >
                        <el-switch  v-model="AddressList.sendStatus" :active-value="1" :inactive-value="0"></el-switch>
                    </el-form-item>
                </el-col>
            </el-form>
        </el-row>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="addAddress">确 定</el-button>
      </span>
    </el-dialog>
    </div>
</template>
<script>
import address from "@/api/order/address";
export default {
    data(){
        return{
        dialogVisible: false,
        //验证
         rules: {
          addressName: [
            { required: true, message: '请输入发货地址', trigger: 'blur' },
          ]},
          id:'',
            AddressList:{
                addressName:'',
                name:'',
                phone:'',
                postCode:'',
                //省
                province:'',
                //市
                city:'',
                //区
                region:'',
                detailAddress:'',
                sendStatus:1,
                receiveStatus:1,
            }
        }
    },
    methods:{
        //新增
        setAddress(){
            this.dialogVisible=true;
        },
        //编辑
        open(row){
            console.log(row)
            this.id=row.id
            this.AddressList=row;
            this.dialogVisible=true;
        },
        //点击确定
        addAddress(){
            console.log(this.AddressList)
             if(this.id){
              console.log(this.id,"修改地址")
            this.$confirm('是否确认修改, 是否继续?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
                }).then(() => {
                    console.log(this.AddressList);   
                    address.update(this.AddressList).then(res=>{
                        console.log(res);
                        if(res.success){
                            this.$message({
                                type: 'success',
                                message: '修改成功!'
                            });
                        }else{
                            this.$message.error("修改地址失败")
                        }
                    })
                  
                    this.dialogVisible=false;
                }).catch(() => {
                this.$message({
                    type: 'info',
                    message: '已取消'
                });          
                });
              
          }else{
              console.log(this.id,"新增地址")
            this.$confirm('是否确认新增地址, 是否继续?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
                }).then(() => {
                    console.log(this.AddressList);   
                    address.save(this.AddressList).then(res=>{
                        console.log(res);   
                        if(res.success){
                            this.$message({
                                type: 'success',
                                message: '新增成功!'
                            });
                        }else{
                            this.$message.error("添加地址失败")
                        }
                    })
                    this.dialogVisible=false;
                }).catch(() => {
                  
                this.$message({
                    type: 'info',
                    message: '已取消'
                });          
                });
             }
            
        },
        //点击是否关闭
     handleClose(done) {
        this.$confirm('确认关闭？')
          .then(_ => {
            done();
          })
          .catch(_ => {});
      },
    },
    created(){

    }
}
</script>